<template>
<div class="playlist">
    <div class="playlist-top">
        <div class="left">
            <svg class="icon" aria-hidden="true">
                <use xlink:href="#icon-bofang1"></use>
            </svg>
            <div class="detail">
                <div class="title">播放全部</div>
                <div class="number">（共**首）</div>
            </div>
        </div>
    </div>
</div>
</template>

<script>
// import { reactive } from '@vue/reactivity'
// import {onMounted} from 'vue'
// export default {
//     setup(){
//         const playlist = reactive()

//         onMounted(()=>{
//             let musicList = getMusicList(6).then((res)=>{
//                 state.musicList=res.data.result;
//             })
//         })
//     }
// }
</script>

<style lang="less" scoped>
.playlist{
    background-color: #fff;
    width: 7.5rem;
    height: 5.2rem;
    display: flex;
    margin-top: 0.26rem;
    .playlist-top{
        height: 1rem;
        display: flex;
        .left{
            display: flex;
            flex-direction: row;
            margin-left: 0.3rem;
            .icon{
                width: 0.5rem;
            }
            .detail{
               display: flex;
               flex-direction: row; 
               align-items: center;
               margin-left: 0.2rem;
            }
        }
    }
}
</style>